One of my greatest frustrations after first
exploring the new draw methods in Macromedia Flash
MX was the trouble I had using curveTo
effectively. It was non-intuitive and non-trivial
(at least to me) to draw a 'normal' circle or arc.
So in my frustration, I created an extension to
the Macromedia Flash built-in drawing API to
handle the creation of those shapes. Over time,
this extension multiplied. They eventually took on
a life of their own, becoming a larger toolset for
drawing shapes and structures.
In the end I had nine new tools.
Some are
useful, others whimsical, but all of them are free to use as
you see fit. They are free of charge or obligation. I have
endeavored to make these methods robust and useful, however I
can make no guarantees about their suitability to your
specific needs. I similarly make no guarantees that they are
bug or problem free: caveat emptor. I have commented them
heavily and hopefully this will let those encountering the
built-in drawing methods for the first time understand how
they can be used to create useful tools. It should also
provide sufficient information for those more experienced to
adapt them to their specific needs or styles.
Before you
begin, download the sample files. The sample files contain the
AS files that are discussed in this article, along with a FLA
file with examples of usage:
Below is an
explanation of each AS file that you'll find in the sample
files folder.
One last
thing before we get to the methods themselves: There are ways
to optimize ActionScript to increase the speed of the code
execution, but at the cost of making the ActionScript more
obtuse. These methods serve a dual purpose. The first is to
reduce drawing complex elements to a single line of code. The
second is to be a tool for learning. Because of the second
(and to my mind, more important) purpose, I have left some of
these methods 'unoptimized'. For those that are not yet
familiar with the Flash MX built-in drawing methods, be sure
to check out the first part of this series, Introduction
to Macromedia Flash MX Drawing Methods.
Okay, now
we've cleared that up, on to the methods...
dashTo.as
The method
mc.dashTo is used to draw
dashed (and dotted) lines. I made this to extend the lineTo
function because the built-in method doesn't have the custom
line types that the line tool has in Macromedia Flash MX.
drawArc.as
The method mc.drawArc is used to draw regular and
elliptical arc segments. This method replaces the method I
originally released to the Macromedia Flash MX beta group
titled arcTo. This method contains several
optimizations based on input from the following people: Robert
Penner, Eric Mueller, and Michael Hurwicz.
drawBurst.as
The method mc.drawBurst is used to draw bursts
(rounded star shaped ovals often seen in advertising). This
seemingly whimsical method actually had a serious purpose. It
was done to accommodate a client that wanted to have custom
bursts for 'NEW!' and 'IMPROVED!' type elements on their site.
Personally I think those look tacky, but it's hard to argue
with a paying client. This method also makes some fun flower
shapes if you play with the input numbers.
drawGear.as
The method mc.drawGear is used to draw gears. You
know, cogs with teeth and a hole in the middle where the axle
goes? Okay, okay...so nobody needs a method to draw a
gear. But it was an easy adaptation of the polygon method, so
I did it anyway.
drawOval.as
The method mc.drawOval is used to create circles and
ovals. Hopefully this one is pretty straight forward. This
method, like most of the others, is not as optimized as it
could be. This was a conscious decision to keep the code as
accessible as possible for those either new to ActionScript or
to the math involved in plotting points on a curve.
drawPoly.as
The method mc.drawPoly is used to create regular
polygons. This allows you to draw the polygons either
clockwise or counter-clockwise (based on the 'sides' argument)
so that you can use it to knock holes in dynamically created
masks.
drawRect.as
The method mc.drawRect is used to draw rectangles
and rounded rectangles. Regular rectangles are easy enough to
just rebuild in any file as needed, but the rounded rectangle
is required more frequently, hence the method. The rounding is
very much like that of the rectangle tool in Macromedia Flash
MX. If the rectangle is smaller in either dimension than the
rounding would permit, the rounded corners scale down to
fit.
drawStar.as
The method mc.drawStar is used to draw star shaped
polygons. Like mc.drawPoly,
it can draw stars in either direction—which is helpful for
creating knockouts.
drawWedge.as
The method mc.drawWedge is used to draw pie shaped
wedges. Very useful for creating charts. Again, special thanks
is due to: Robert Penner, Eric Mueller, and Michael Hurwicz
for their contributions.
I hope you
enjoy these methods as much as I enjoyed creating them.
Hopefully you'll have some time to devote to using them,
either in projects or as a tool for learning. Perhaps you'll
even create some of your own!
Ric Ewing
has been working in software development, interface design,
and game design for nearly 15 years. Most recently, he was the
Principal Media Architect for Riverdeep (formerly Edmark),
where he created award-winning children's educational software
for over seven years. For the past two years he has focused
primarily on developing streaming educational content for
delivery to both home and school markets, with Macromedia
Flash being the primary mechanism for delivery. Ric's current
project is Ric Ewing Design, a web design group that
specializes in website development and interactive user
experiences. He can be reached at ric@ricewing.com.